@extends("admin.layout.layout")
@section('title', '会员列表')
@section('content')
    <div class="x-nav">
          <span class="layui-breadcrumb">
            <a href="">会员管理</a>
            <a href="">会员列表</a>
              {{--<a>--}}
              {{--<cite>导航元素</cite></a>--}}
          </span>
        <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
           onclick="location.reload()" title="刷新">
            <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i></a>
    </div>
    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="layui-card-header">
                        <button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除
                        </button>
                        <button class="layui-btn" onclick="xadmin.open('添加用户','{{url("admin/role/create")}}',600,400)">
                            <i class="layui-icon"></i>添加
                        </button>
                    </div>
                    <div class="layui-card-body layui-table-body layui-table-main">
                        <table class="layui-table layui-form">
                            <thead>
                            <tr>
                                <th>
                                    <input type="checkbox" lay-filter="checkall" name="" lay-skin="primary">
                                </th>
                                <th>ID</th>
                                <th>角色名称</th>
                                <th>权限列表</th>
                                <th>状态</th>
                                <th>操作</th>
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($role as $k=>$v)
                                <tr>
                                    <td>
                                        <input type="checkbox" name="id" value="{{$v->id}}" lay-skin="primary">
                                    </td>
                                    <td>{{$v->id}}</td>
                                    <td>{{$v->role_name}}</td>
                                    <td>
                                        <?php $per=[]; ?>
                                    @foreach($v->permission as $val)
                                                <?php $per[]=$val->per_name;?>
                                        @endforeach
                                        {{implode($per,',')}}
                                    </td>
                                    <td class="td-status">
                                        @if($v->status==1)
                                            <span class="layui-btn layui-btn-normal layui-btn-mini">已启用</span>
                                        @else
                                            <span class="layui-btn layui-btn-disabled layui-btn-mini">已停用</span>
                                        @endif
                                    </td>
                                    <td class="td-manage">
                                        <a onclick="member_stop(this,'{{$v->id}}')" href="javascript:;"
                                           title="{{$v->status==1?'启用':'停用'}}">
                                            <i class="layui-icon">&#xe601;</i>
                                        </a>
                                        <a title="编辑" onclick="xadmin.open('编辑','{{url("admin/role/".$v->id."/edit")}}',600,400)"
                                           href="javascript:;">
                                            <i class="layui-icon">&#xe642;</i>
                                        </a>
                                        <a title="删除" onclick="member_del(this,'{{$v->id}}')" href="javascript:;">
                                            <i class="layui-icon">&#xe640;</i>
                                        </a>
                                    </td>
                                </tr>
                            @endforeach

                            </tbody>
                        </table>
                    </div>
                    <div class="layui-card-body ">
                        <div class="page">
                            <div>
                                {{ $role->links() }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        layui.use(['laydate', 'form'], function () {
            var laydate = layui.laydate;
            var form = layui.form;


            // 监听全选
            form.on('checkbox(checkall)', function (data) {

                if (data.elem.checked) {
                    $('tbody input').prop('checked', true);
                } else {
                    $('tbody input').prop('checked', false);
                }
                form.render('checkbox');
            });
        });

        /*用户-停用*/
        function member_stop(obj, id) {
            layer.confirm('确认要修改状态吗？', function (index) {

                if ($(obj).attr('title') == '启用') {
                    $.post('{{url("admin/role/checkstatus")}}', {'_token':'{{csrf_token()}}','id': id, 'status': 0}, function (res) {
                        if (res.status == 0) {
                            //发异步把用户状态进行更改
                            $(obj).attr('title', '停用');
                            $(obj).find('i').html('&#xe62f;');

                            $(obj).parents("tr").find(".td-status").find('span').addClass('layui-btn-disabled').html('已停用');
                            layer.msg('已停用!', {icon: 5, time: 1000});
                        } else {
                            layer.msg('操作失败!');
                        }
                    }, 'json');

                } else {
                    $.post('{{url("admin/role/checkstatus")}}', {'_token':'{{csrf_token()}}','id': id, 'status': 1}, function (res) {
                        if (res.status == 0) {
                            //发异步把用户状态进行更改
                            $(obj).attr('title', '启用');
                            $(obj).find('i').html('&#xe601;');

                            $(obj).parents("tr").find(".td-status").find('span').removeClass('layui-btn-disabled').addClass('layui-btn-normal').html('已启用');
                            layer.msg('已启用!', {icon: 5, time: 1000});
                        } else {
                            layer.msg('操作失败!');
                        }
                    }, 'json');

                }

            });
        }

        /*用户-删除*/
        function member_del(obj, id) {
            layer.confirm('确认要删除吗？', function (index) {
                //发异步删除数据
                $.ajax({
                    url: '/admin/role/'+id,
                    type: 'DELETE',
                    data:{
                        '_token':'{{csrf_token()}}'
                        ,'id':id
                    },
                    dataType:'json',
                    success: function(res) {
                        if(res.status == 0){
                            //发异步，把数据提交给php
                            $(obj).parents("tr").remove();
                            layer.msg('已删除!', {icon: 1, time: 1000});
                        }else {
                            layer.msg(res.data[0]);
                        }
                    }
                });

            });
        }


        function delAll(argument) {
            var ids = [];

            // 获取选中的id
            $('tbody input').each(function (index, el) {
                if ($(this).prop('checked')) {
                    ids.push($(this).val())
                }
            });

            layer.confirm('确认要删除吗？' + ids.toString(), function (index) {
                //捉到所有被选中的，发异步进行删除
                $.ajax({
                    url: '/admin/role/deleteall',
                    type: 'POST',
                    data:{
                        '_token':'{{csrf_token()}}'
                        ,'ids':ids
                    },
                    dataType:'json',
                    success: function(res) {
                        if(res.status == 0){
                            //发异步，把数据提交给php
                            layer.msg('删除成功', {icon: 1});
                            $(".layui-form-checked").not('.header').parents('tr').remove();
                        }else {
                            layer.msg(res.data[0]);
                        }
                    }
                });

            });
        }


    </script>
@endsection